//progreso de carga
var reader;
var progress = document.querySelector('.percent');
var fuentes = [];

var contextClass = (window.AudioContext || window.webkitAudioContext
		|| window.mozAudioContext || window.oAudioContext || window.msAudioContext);
var context = (contextClass ? new contextClass() : null);

//shim layer with setTimeout fallback
window.requestAnimFrame = (function(){
return  window.requestAnimationFrame       || 
  window.webkitRequestAnimationFrame || 
  window.mozRequestAnimationFrame    || 
  window.oRequestAnimationFrame      || 
  window.msRequestAnimationFrame     || 
  function( callback ){
  window.setTimeout(callback, 1000 / 60);
};
})();

var FuenteAudio = function(buffer, canal) {
//	this.buffer = buffer;
	this.buffer;
//	this.source = context.createBufferSource();
	this.source;
//	this.source.buffer = buffer;
//	this.gainNode = context.createGain();
	this.gainNode;
//	this.source.connect(this.gainNode);
//	this.gainNode.connect(context.destination);
	this.canal = canal;
	this.volumen = 1;
	this.interval;
};

$(document).ready(function() {
	archivos();
	recargar();
	//inicializarControles();

});

function archivos() {
	archivoDisponible();
//	asociarHandler();
}

function recargar(){
	$('.srcFuente').each(function(){
		var clases = $(this).attr("class").split(" ");
		var canal = "";
		for(var i=0; i<clases.length; i++){
			if(clases[i]!="srcFuente"){
				canal=clases[i]; 
				break;
			};
		}
		agregarFuente(null, canal);
		
		if($('#form\\:activo'+canal).attr('checked')=='checked'){
			$('#grafica'+canal).addClass("canvasActivo");
		}
//		loadSoundFile("http://localhost:8080/"+$(this).attr("src"),canal);
		
//		requestAnimFrame(function(){
//			for (i in fuentes) {
//				var fuente=  fuentes[i];
//				if(fuente.canal){
//					visualizar(fuente);
//				}
//			}
//		});
	});
	
	
}

function string2ArrayBuffer(string,canal) {
    var bb = new BlobBuilder();
    bb.append(string);
    var f = new FileReader();
    f.onload = function(e) {
        initSound(e.target.result,canal);
    },
    f.readAsArrayBuffer(bb.getBlob());
}

function archivoDisponible() {
	// Check for the various File API support.
	if (window.File && window.FileReader && window.FileList && window.Blob) {
		// Great success! All the File APIs are supported.
	} else {
		alert('The File APIs are not fully supported in this browser.');
	}
	progress = document.querySelector('.percent');
}

function asociarHandler() {
	document.getElementById('cargarFile').addEventListener('change',manejarSeleccionArchivo, false);
}

function manejarSeleccionArchivo(evt) {
	// Reset progress indicator on new file selection.
	progress.style.width = '0%';
	progress.textContent = '0%';

	reader = new FileReader();
	reader.onerror = manejarError;
	reader.onprogress = progresoCarga;
	reader.onabort = function(e) {
		alert('Cancelado');
	};
	reader.onloadstart = function(e) {
		document.getElementById('progress_bar').className = 'loading';
	};
	reader.onload = function(e) {
		// Ensure that the progress bar displays 100% at the end.
		progress.style.width = '100%';
		progress.textContent = '100%';
		setTimeout("document.getElementById('progress_bar').className='';",2000);
		var canal = $("#canalCargar option:selected").val();
		var result = e.target.result;
		$("#src" + canal).attr("src", result);
		$("#form\\:srcHidden" + canal).val(result);
		$("#form\\:activo" + canal).attr("checked", "checked");
		$("#form\\:pista").val(canal);
		$("#form\\:cargar"+canal);
		//resetinput file
		$("#cargarFile").replaceWith($("#cargarFile").clone());

	};

	readerArray = new FileReader();
	readerArray.onload = function(e) {
		var canal = $("#canalCargar option:selected").val();
		initSound(this.result, canal);	
	};
	
	var file = evt.target.files[0];
	readerArray.readAsArrayBuffer(file);
	reader.readAsDataURL(file);

}


function initSound(arrayBuffer, canal) {
	context.decodeAudioData(arrayBuffer, function(buffer) {
		agregarFuente(buffer,canal);
	}, function(e) {
		console.log('Error decoding file', e);
	});
}

function agregarFuente(buffer,canal){
	var fuenteCargar = new FuenteAudio(buffer, canal);
	var esta = false;
	
	for (i in fuentes) {
		var fuente=  fuentes[i];
		if (fuente.canal && fuente.canal == canal) {
			esta = true;
			fuentes[i] = fuenteCargar;
			break;
		}
	}
	if (!esta) {
		fuentes.push(fuenteCargar);
	}
}

function buscarFuente(canal){
	var fuenteCargar=null;
	for (i in fuentes) {
		var fuente=  fuentes[i];
		if (fuente.canal && fuente.canal == canal) {
			fuenteCargar = fuentes[i];
			break;
		}
	}
	return fuenteCargar;
}


function progresoCarga(evt) {
	// evt is an ProgressEvent.
	if (evt.lengthComputable) {
		var percentLoaded = Math.round((evt.loaded / evt.total) * 100);
		// Increase the progress bar length.
		if (percentLoaded < 100) {
			progress.style.width = percentLoaded + '%';
			progress.textContent = percentLoaded + '%';
		}
	}
}

function cancelarLectura() {
	reader.abort();
}

function manejarError(evt) {
	switch (evt.target.error.code) {
	case evt.target.error.NOT_FOUND_ERR:
		alert('File Not Found!');
		break;
	case evt.target.error.NOT_READABLE_ERR:
		alert('File is not readable');
		break;
	case evt.target.error.ABORT_ERR:
		break; // noop
	default:
		alert('An error occurred reading this file.');
	}
}



function control(canal, funcionalidad, obj) {
//	var idParent = $(obj).parent()[0].id;
//	$("#"+idParent+" input[type='button']").removeAttr("disabled","disabled");
//	$(obj).attr("disabled","disabled");
	if (canal != 'Descarga') {
		var fuente = buscarFuente(canal);
		visualizarSimple(fuente, funcionalidad);
		if (funcionalidad == 'reproducir') {
			document.getElementById('form:src' + canal).play();
		} else if (funcionalidad == 'pausar') {
			document.getElementById('form:src' + canal).pause();
		} else if (funcionalidad == 'parar') {
			document.getElementById('form:src' + canal).load();
		} else if (funcionalidad == 'volumen') {
			document.getElementById('form:src' + canal).volume = (obj.value);
			fuente.volumen = obj.value;
//			fuente.gainNode.gain.value=obj.value;
		} else if (funcionalidad == 'guardar') {
			$("#form\\:pista").val(canal);
			$("#form\\:volumen").val($("#controlvolumen"+canal).val());
		}
	}
	else{
		for(i in fuentes){
			var fuente= fuentes[i]; 
			if(fuente){
				visualizarSimple(fuente, funcionalidad);
				if (funcionalidad == 'reproducir') {
					reproducirFuente(fuente,0);
				} else if (funcionalidad == 'pausar') {
					document.getElementById('src' + canal).pause();
				} else if (funcionalidad == 'parar') {
					pararFuente(fuente);
				} else if (funcionalidad == 'volumen') {
					volumenFuentes(fuente);
				}
			}
		}
	}

}

function visualizarSimple(fuente, funcionalidad) {
	if ($('#form\\:activo' + fuente.canal).attr('checked') == 'checked') {
		if (funcionalidad == 'reproducir') {
			$('#grafica' + fuente.canal).removeClass();
			fuente.interval = setInterval(function() {
				$('#grafica' + fuente.canal).toggleClass("canvasReproducir1");
			}, 500);
		} else if (funcionalidad == 'pausar') {
			$('#grafica' + fuente.canal).removeClass();
			clearInterval(fuente.interval);
			$('#grafica' + fuente.canal).toggleClass("canvasReproducir2");
		} else if (funcionalidad == 'parar') {
			clearInterval(fuente.interval);
			$('#grafica' + fuente.canal).removeClass();
			$('#grafica' + fuente.canal).toggleClass("canvasActivo");
		}
	}
}

function reproducirFuente(fuente, time) {
//	fuente.source = context.createBufferSource();
//	fuente.source.buffer = fuente.buffer;
	var mediaElement = document.getElementById('form:src'+fuente.canal);
//	fuente.source = context.createMediaElementSource(mediaElement);
//	fuente.gainNode = context.createGain();
//	fuente.source.connect(fuente.gainNode);
//	fuente.gainNode.connect(context.destination);
//	fuente.gainNode.gain.value=fuente.volumen;
//	fuente.source.mediaElement.play();
	mediaElement.play();
//	fuente.source.noteOn(time);
}

function pararFuente(fuente) {
	var mediaElement = document.getElementById('form:src'+fuente.canal);
	mediaElement.load();
}
function pausarFuente(fuente) {
	var mediaElement = document.getElementById('form:src'+fuente.canal);
	mediaElement.pause();
}

function visualizar(fuente){
	
	var canvas =$('#grafica'+fuente.canal)[0];
	var HEIGHT = $('#grafica'+fuente.canal).height();
	var WIDTH = $('#grafica'+fuente.canal).width();
	var drawContext = canvas.getContext('2d');
	$('#form\\:src'+fuente.canal).replaceWith($('#form\\:src'+fuente.canal).clone());
	var mediaElement = document.getElementById('form:src'+fuente.canal);
	fuente.source = context.createMediaElementSource(mediaElement);
//	fuente.source = context.createBufferSource();
//	fuente.source.buffer = fuente.buffer;
	var analyser = context.createAnalyser();
	analyser.connect(context.destination);
	fuente.source.connect(analyser);
	var timeDomain =  new Uint8Array(analyser.frequencyBinCount);
	analyser.getByteTimeDomainData(timeDomain);
	for(var i = 0; i< analyser.frequencyBinCount; i++){
		var value = timeDomain[i];
		var percent = value/256;
		var height = HEIGHT * percent;
		var offset = HEIGHT - height -1;
		var barWidth = WIDTH/analyser.frequencyBinCount;
	    drawContext.fillStyle = 'white';
	    drawContext.fillRect(i * barWidth, offset, 1, 2);
	}
}

function loadSoundFile(url,canal) {
	  var xhr = new XMLHttpRequest();
	  xhr.open('POST', url, true);
	  xhr.responseType = 'arraybuffer';
	  xhr.onreadystatechange = function(e) {
		  if (xhr.readyState==4) {
			  initSound(this.response,canal); // this.response is an ArrayBuffer.
		  }
	  };
	  xhr.send();
	}
